<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>虚拟姬</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="lib/css/bootstrap.min.css">
    <link rel="stylesheet" href="lib/css/custom.css">
    <link rel="stylesheet" type="text/css" href="lib/css/loaders.css"/>
    <link rel="stylesheet" href="lib/css/magnific-popup.css">
    <link rel="stylesheet" href="lib/css/animate.min.css">
    <link rel="stylesheet" href="lib/css/font-awesome.min.css">
    <link rel="stylesheet" href="lib/css/nivo-lightbox.css">
    <link rel="stylesheet" href="lib/css/nivo_themes/default/default.css">
    <link rel="stylesheet" href="lib/css/hover-min.css">
    <link rel="stylesheet" href="lib/css/contact-input-style.css">
    <link href='http://cdn.webfont.youziku.com/webfonts/nomal/125508/46865/5bfe62b9f629d90e48171439.css' rel='stylesheet' type='text/css' />
	  <link type="text/css"  rel="stylesheet" href="asserts/css/index.css"/>
</head>
<body>
    <div class="loader loader-bg">
        <div class="loader-inner ball-pulse-rise">
            <div></div>
            <div></div>
            <div></div>
            <div></div>
            <div></div>
        </div>
    </div>
    
    <nav class="navbar navbar-default top-bar affix" data-spy="affix" data-offset-top="250" >
        <div class="container">
            <div class="navbar-header">
            <a class="navbar-brand" href="index.html"><img class="logo" src="img/logo-white.png"></a>
            </div>
            <div id="navbar" class="navbar-collapse collapse">
            
            <ul class="nav navbar-nav navbar-right">
                <li><a href="#banner">主站</a></li>
                <li><a href="#">比赛</a></li>
                <li><a href="#">直播</a></li>
                <li><a href="#">周边</a></li>
                <li><a href="#">会员</a></li>
                <li><a href="#contact-sec">注册</a></li>
            
            </ul>
            </div>
        </div>
    </nav>
    
    
        
    <!------------ Home Banner ------------>
    <section id="banner" class="parallax">
        <div class="gradient-overlay"></div>
            <div class="container">
            <div class="row">

                <div class="col-md-offset-2 col-md-8 col-sm-12">
                    <h1 class="wow fadeInUp" data-wow-delay="1s">虚拟姬</h1>
                    <br>
                    <p class="wow fadeInUp logan" data-wow-delay="1s">偶像的力量</p>
                    <a href="http://47.106.207.177/project/login.html" class="wow fadeInUp btn btn-transparent-white btn-capsul btn-login" data-wow-delay="1s">登 录</a>
                    <a href="http://47.106.207.177/project/register.html" class="wow fadeInUp btn btn-transparent-white btn-capsul btn-register" data-wow-delay="1s">注 册</a>
                </div>

            </div>
            </div>
    </section>
    
    
    <!------------ todo Section ------------>
    <section id="todo" class="parallax">
      <div class="container">
        <div class="row">
          <div class="col-md-offset-2 col-md-8 col-sm-offset-1 col-sm-10 text-center">
              <div class="wow fadeInUp section-title" data-wow-delay="0.6s">
                <div class="block-header">我们能做什么</div>
              </div>
          </div>
    
          <div class="clearfix"></div>
    
          <div class="col-md-4 col-sm-6 wow fadeInUp" data-wow-delay="0.3s">
            <div class="feature-thumb">
              <div class="feature-icon">
                 <span><img class="img-responsive" src="img/todo-icon-01.png" /></span>
              </div>
              <h3>打造虚拟偶像</h3>
              <p>您喜欢二次元人物吗？<br>来这里用简单的操作打造自己理想中的虚拟形象吧！</p>
            </div>
          </div>
    
          <div class="col-md-4 col-sm-6 wow fadeInUp" data-wow-delay="0.6s">
            <div class="feature-thumb">
              <div class="feature-icon">
                <span><img class="img-responsive" src="img/todo-icon-02.png" /></span>
              </div>
              <h3>虚拟偶像交易</h3>
              <p>您想要自己的劳动成果变现吗？<br>来我们的项目平台进行虚拟偶像的交易吧！</p>
            </div>
          </div>
    
          <div class="col-md-4 col-sm-6 wow fadeInUp" data-wow-delay="0.9s">
            <div class="feature-thumb">
              <div class="feature-icon">
                <span><img class="img-responsive" src="img/todo-icon-03.png" /></span>
              </div>
               <h3>引导社会风气</h3>
               <p>您仰慕某位大佬吗？<br>来这里为他或她定制专属于他们的虚拟偶像吧！</p>
            </div>
          </div>
        </div>
      </div>
    </section>
    
    <!------------ Video section ------------>
    <section id="video-sec" class="parallax">
      <div class="overlay"></div>
        <div class="container">
          <div class="row">
              <div class="col-md-offset-2 col-md-8 col-sm-12">
                  <div class="wow fadeInUp vidol-3d" data-wow-delay="0.5s">我们的虚拟偶像<span><br>虚拟偶像的3D舞蹈，敬请欣赏</span></div>
                  <a class="popup-youtube" id="play" href="http://47.106.207.177/play/MyMMD.html" ><i class="fa fa-play"></i></a>
              </div>
    
          </div>
        </div>
    </section>

    <!------------ Menu section ------------>
    <section id="location" class="parallax">
      <div class="container">
        <div class="row">
            <div class="col-md-offset-2 col-md-8 col-sm-offset-1 col-sm-10">
                <div class="wow fadeInUp section-title" data-wow-delay="1s">
                   <div class="block-header">令人期待的功能列表</div>
               </div>
             </div>
        </div>
        <br><br>
        <div class="row">
          <div class="col-md-6 col-sm-12">
            <div class="media wow fadeInUp" data-wow-delay="0.5s">
              <div class="media-object pull-left">
                <img src="img/location-01.jpg" class="img-responsive" alt="Food Menu">
              </div>
              <div class="media-body">
                <h3 class="media-heading">面部调整</h3>
                <p>虚拟偶像的脸型、表情均可自行调节。令人惊艳的外表等着您去创造！</p>
                <a href="http://47.106.207.177/play/MMDFace.html" class="btn btn-capsul btn-transparent-prime">Now Try It !</a>
              </div>
            </div>
    
    
          </div>
    
          <div class="col-md-6 col-sm-12">
            <div class="media wow fadeInUp" data-wow-delay="0.5s">
              <div class="media-object pull-left">
                <img src="img/location-03.jpg" class="img-responsive" alt="Food Menu">
               </div>
              <div class="media-body">
                <h3 class="media-heading">3D舞蹈</h3>
                <p>是您亲手制作的3D偶像！想从360度各个角度欣赏他或她的舞姿吗？</p>
                  <a href="http://47.106.207.177/play/MyMMD.html" class="btn btn-capsul btn-transparent-prime">Now Try It !</a>
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>
    
    
    <!------------ Gallery section ------------>
    <section id="hotels" class="parallax">
      <div class="container">
        <div class="row">
            <div class="col-md-offset-2 col-md-8 col-sm-offset-1 col-sm-10 text-center">
                <div class="wow fadeInUp section-title" data-wow-delay="1s">
                   <div class="block-header">我们的客户</div>
               </div>
             </div>
        </div>
        <br><br>
        <div class="row">
          <div class="col-md-12">
              <!-- iso section -->
              <div class="iso-section wow fadeInUp text-center" data-wow-delay="0.5">
                        <!-- iso box section -->
                        <div class="iso-box-section wow fadeInUp" data-wow-delay="0.9s">
                          <div class="iso-box-wrapper col4-iso-box">
    
                            <div class="iso-box cq cqu col-md-4 col-sm-6">
                              <div class="gallery-thumb">
                                <a href="img/organize-01.jpg" data-lightbox-gallery="food-gallery">
                                  <img src="img/organize-01.jpg" class="fluid-img" alt="Gallery">
                                    <div class="gallery-overlay">
                                      <div class="gallery-item">
                                        <i class="fa fa-search"></i>
                                      </div>
                                    </div>
                                </a>
                              </div>
                              <h3>新闻网虚拟代言人渝小薇</h3>
                            </div>

                            <div class="iso-box cq cqu col-md-4 col-sm-6">
                              <div class="gallery-thumb">
                                <a href="img/organize-02.jpg" data-lightbox-gallery="food-gallery">
                                  <img src="img/organize-02.jpg" class="fluid-img" alt="Gallery">
                                    <div class="gallery-overlay">
                                      <div class="gallery-item">
                                        <i class="fa fa-search"></i>
                                      </div>
                                    </div>
                                </a>
                              </div>
                              <h3>唐仲英爱心协会</h3>
                            </div>
    
                            
    
                           </div>
                        </div>
    
              </div>
    
          </div>
    
        </div>
      </div>
    </section>
    
    <!------------ Contact section ------------>
    <section id="contact-sec" class=" content">
      <div class="overlay"></div>
        <div class="container form-block">
            <div class="row">
                <div class="col-lg-12 text-center"><h2>想开启您的虚拟姬旅程吗？</h2></div>
                    <div class="col-lg-4 col-md-4 col-sm-12">
                    <span class="input input-hoshi">
                        <input class="input_field input_field-hoshi" type="text" id="input-4" />
                        <label class="input_label input_label-hoshi input_label-hoshi-color-4" for="input-4">
                            <span class="input_label-content input_label-content-hoshi">创建您的用户名</span>
                        </label>
                    </span>
                    </div>
                    <div class="col-lg-4 col-md-4 col-sm-12">
                    <span class="input input-hoshi">
                        <input class="input_field input_field-hoshi" type="text" id="input-4" />
                        <label class="input_label input_label-hoshi input_label-hoshi-color-4" for="input-4">
                            <span class="input_label-content input_label-content-hoshi">创建您的邮箱</span>
                        </label>
                    </span>
                    </div>
                    <div class="col-lg-4 col-md-4 col-sm-12">
                    <span class="input input-hoshi">
                        <input class="input_field input_field-hoshi" type="text" id="input-4" />
                        <label class="input_label input_label-hoshi input_label-hoshi-color-4" for="input-4">
                            <span class="input_label-content input_label-content-hoshi">请留下您的电话</span>
                        </label>
                    </span>
                    </div>
                    
                    
                    
            </div>
            <div class="row">
              <div class="col-lg-6 col-md-4 col-sm-12">
                <span class="input input-hoshi">
                    <input class="input_field input_field-hoshi" type="text" id="input-4" />
                    <label class="input_label input_label-hoshi input_label-hoshi-color-4" for="input-4">
                        <span class="input_label-content input_label-content-hoshi">输入密码</span>
                    </label>
                </span>
              </div>
              <div class="col-lg-6 col-md-4 col-sm-12">
                <span class="input input-hoshi">
                    <input class="input_field input_field-hoshi" type="text" id="input-4" />
                    <label class="input_label input_label-hoshi input_label-hoshi-color-4" for="input-4">
                        <span class="input_label-content input_label-content-hoshi">重复密码</span>
                    </label>
                </span>
              </div>
            </div>

            <div class="row">
              <div class="col-lg-12 col-md-12 col-sm-12 text-center">
                <a href="#" class="btn btn-capsul btn-transparent-white btn-submit">提 交</a>
              </div>
            </div>
        </div>
    </section>
    
    <!------------ Footer section ------------>
    <footer>
            <div class="container">
                <div class="row">
                    <div class="col-sm-12 col-md-3">&copy;<script type="text/javascript">document.write(new Date().getFullYear());</script> 虚拟姬团队</div>
                    <div class="col-sm-12 col-md-2 col-md-offset-7">重庆大学</a></div>
                </div>
            </div>
    </footer>
    
</body>
<script src="lib/js/jquery.js"></script>
<script src="lib/js/bootstrap.min.js"></script>
<script src="lib/js/jquery.magnific-popup.min.js"></script>
<script src="lib/js/jquery.backstretch.min.js"></script>
<script src="lib/js/isotope.js"></script>
<script src="lib/js/imagesloaded.min.js"></script>
<script src="lib/js/nivo-lightbox.min.js"></script>
<script src="lib/js/jquery.parallax.js"></script>
<script src="lib/js/smoothscroll.js"></script>
<script src="lib/js/wow.min.js"></script>
<script src="lib/js/core.js"></script>

</html>